Teochew Thunder

96 results found. Wayang Progress Bar
A fake progress bar to encourage patience in users.
Source Demo

Year of the Goat
A CSS animation for Chinese New Year.
Source Demo

Trail of Hearts
Whimsical DOM magic for Valentine's Day.
Source Demo

LKY Memorial
A HTML/CSS overlay to commemorate the death of Lee Kuan Yew.
Source Demo

The Ngerng Effect, a.k.a Infinite Scroll
An infinitely crolling page with nonsense content.
Source Demo

Faux 3D Easter Egg
Rotating 3D Easter Egg.
Source Demo

The Lightbox Effect
Replicating the dimmer/popup effect.
Source Demo

CSS CAPTCHA
Proof-of-concept of a CSS-generated CAPTCHA.
Source Demo

CSS Rainbowlizer
Making a rainbow overlay on a profile pic.
Source Demo

Wheel of Fortune
A Roulette Wheel with results.
Source Demo

HTML5 Placeholder
Simulating the HTML5 Placeholder tag in older tech.
Source Demo

Remembering Paris
A CSS to commemorate the bombings.
Source Demo

A Christmas Animation
Christmas-themed animation for web greetings.
Source Demo

Star Wars Scroll
Scrolling text, Star Wars style.
Source Demo

Year of the Monkey Countdown
Countdown code for CNY, with animations.
Source Demo

Valentine's Maze Game
A maze game with a Valentine's Day theme, inspired from an app.
Source Demo

Easter Egg Generator
jQuery interface for creating an Easter Egg, with print feature.
Source Demo

Javascript Clockface
Typical animated clock face.
Source Demo

Rollover Buttons
Code for making rollovers, using Facebook, LinkedIn and Twitter icons as examples.
Source Demo

Browser Butterfly
An animated butterfly which flits around the screen.
Source Demo

Mini-Carousel
Marquee-type carousel, used on the front page of this site.
Source Demo

Scroll-down Christmas Carol
A scrolling page with content that changes with the scroll.
Source Demo

Valentine Scratch Card
Scratch-card simulation with Valentine's Day theme.
Source Demo

Hacker Republic Login Interface
A simulation of the login interface from The Girl Who Kicked The Hornet's Nest.
Source Demo

Easter Parallax Site
Parallax site with Easter theme.
Source Demo

AngularJS BMI Calculator
A web-based BMI calculator using AngularJS.
Source Demo

The Bar Chart
Animated bar chart.
Source Demo

The Line Graph
Animated line graph.
Source Demo

The Anti-CSRF Token
A basic demo of the Anti-CSRF token written in PHP.
Source Demo

Christmas-themed LESS Demo
A demo of the capabilities of LESS.
Source Demo

The Pie Chart
CSS and JSON Pie Chart.
Source Demo

Wet Floor Effect
Valentine's Day themed special effect.
Source Demo

AngularJS Password Strength Validator
Password Strength Validator with API-based Dictionary Check.
Source Demo

Styling a checkbox
Checkbox jazzed up using HTML, CSS and JavaScript.
Source Demo

Styling a checkbox, redux: The Toggle
Rendering a checkbox as a toggle.
Source Demo

Nike Meme Generator
A PHP image file upload for generation of a Nike-style meme generator.
Source Demo

Smart Drop-down List
Prettied-up drop-down list with input search function.
Source Demo

A Christmas Letter From The CEO
JavaScript animated HTML page for displaying a CEO company address.
Source Demo

Lucky Number Piggy Widget
JavaScript library for rendering a pig with for lucky numbers on an example HTML page.
Source Demo

Valentine Heart Animation
A Valentine's Day animation using jQuery UI.
Source Demo

Easter Bunny River Crossing Game
Homemade browser-based game in HTML, CSS and JavaScript.
Source Demo

Lee Bee Wah Lau!
ReactJS code for displaying random text on screen.
Source Demo

Liverpool Quiz
AngularJS time-limited MCQ Quiz.
Source Demo

Hong Kong Anti-extradition Protest Symbol
CSS replication of protest symbol.
Source Demo

ReactJS British Insult Generator
ReactJS code for generation of insults based on a formula.
Source Demo

Tic Tac Toe
HTML/CSS/JavaScript rendering of the children's game.
Source Demo

Ada Lovelace Day Generator
ReactJS code to generate Ada Lovelace Day for the given year.
Source Demo

Contact Us Page
PHP Contact Us Form with emailing action, basic security and validation, and a custom map.
Source Demo

Christmas Tree SVG Animation
Christmas-themed SVG Animation to illustrate paths, curves and animations.
Source Demo

CNY Rat SVG Animation
SVG Animation of the words "2020" morphing into a stylized rat head.
Source Demo

Tic-tac-toe Valentine's Day Edition
Valentine's Day Edition of Tic-tac-toe, with simulated intelligence
Source Demo

D3 Animated Bar Chart
Animated bar chart rendered in D3 and SVG.
Source Demo

Easter Memory Game
An Easter-themed paired cards memory game written using ReactJS.
Source Demo

D3 Animated Line Chart
Animated line chart rendered in D3 and SVG.
Source Demo

Slide Carousel
A slide carousel implemented in HTML, CSS and JavaScript
Source Demo

D3 Animated Pie Chart
Animated pie chart rendered in D3 and SVG.
Source Demo

Fade Carousel
A fade carousel implemented in HTML/CSS/JavaScript
Source Demo

Louver Carousel
A louver carousel implemented in HTML/CSS/JavaScript
Source Demo

WordSearch Puzzle
Children's wordsearch game in jQuery/HTML/CSS
Source Demo

12 Days of Christmas
A frivolous Christmas-themed ReactJS app to illustrate SVG usage.
Source Demo

Basic JavaScript Unit Testing Suite
HTML/CSS/JavaScript code for basic unit testing
Source Demo

CNY 2021 and Valentine's Day Animation
SVG Animation commemorating the coincidence of the Year of the Ox and Valentine's Day
Source Demo

ReactJS Hangman
NodeJS-created React App for Hangman
Source Demo

VueJS Easter Puzzle
VueJS Easter-themed puzzle
Source Demo

Free Myanmar
SVG/CSS Myanmar Protest Art
Source Demo

Navigational Menu
HTML and CSS multilevel navigational menu
Source Demo

JS Datepicker
JavaScript-based calendar widget for HTML forms
Source Demo

Encryptor/Decryptor
Simple encryptor wth key-based decryptor and email function.
Source Demo

The COVID-19 Dashboard
Singapore COVID-19 D3 data visualization.
Source Demo

Highcharts Column Chart
Highcharts Column Chart with dashboard selectors
Source Demo

VueJS Tile Slider Puzzle
VueJS sliding tiles game.
Source Demo

CNY 2022 Lucky Number Generator
Redone Lucky Number Generator widget with abstraction for future additions.
Source Demo

The Valentine Letter
A frivolous romantic animation in HTML/CSS/JavaScript, with time-specific functions.
Source Demo

Ukraine Protest Art Generator
Simple protest art generator for Ukraine invasion.
Source Demo

Highcharts Line Chart
Highcharts Line Chart with dashboard selectors
Source Demo

Easter Egg Hunt
Choose Your Own Adventure style jQuery game
Source Demo

Florida Man Headline Generator
Funny and frivolous Florida Man headline generator using VueJS
Source Demo

ReactJS Japtrainer
ReactJS created app for Japanese character set training
Source Demo

Highcharts Pie Chart
Highcharts Pie Chart with dashboard selectors
Source Demo

Collision Detector
VueJS script to help detect collision between two objects with varying co-ordinates and sizes.
Source Demo

D3 Heatmap
Animated heatmap rendered using D3 and SVG
Source Demo

Highcharts Heatmap
Highcharts Heatmap with dashboard selectors
Source Demo

The Christmas Flipbook
jQuery Flipbook with user-controlled animation
Source Demo

Year of the Rabbit Animation
CNY animation for the Year of the Rabbit
Source Demo

Valentine's Day SVG Heart Animation
Valentine's Day animated SVG
Source Demo

Easter Egg Line Game
VueJS Easter Egg game
Source Demo

Venn Diagram SVG
SVG of a Venn Diagram
Source Demo

PKCE Generator
PHP and JavaScript based PKCE Generator
Source Demo

JavaScript Tetris
Tetris written in vanilla JavaScript
Source Demo

The Chameleon Site
Using JavaScript to very gradually change site color Using JavaScript to very gradually change site
Source Demo

Oracle APEX Self-affirmations Mailing List app
A Registration Form and Update Form with Login
Source Demo

The Random Christmas Card
A LESS Christmas Card website with A.I generated content.
Source Demo

CNY 2024 Animation
jQuery UI animation of CNY 2024
Source Demo

Valentine's Day 2024 Animation
Valentine's Day animation using jQuery and A.I-generated images
Source Demo

Singapore Bus Service App
Simple bus arrival app using LTA API.
Source Demo

VueJS Easter Puzzle With A.I
Easter VueJS Puzzle with on-the-fly A.I-generated images.
Source Demo

INFO

A collection of widgets and little programs I've compiled (and sometimes use) over the years. Some of it is obviously just for fun, and some of it can be used (and has been used) in various projects. Quite a few of them are Proofs of Concept. This is the stuff I get up to in my free time.

Please note that not all of them conform to accepted best practices. In fact, many of them don't. The key thing here is the idea behind, not so much the implementation.

I have made a point of indicating the technologies used (predominantly HTML, CSS and JavaScript) and the browsers I have tested the code on. If the code does not run on the browser indicated, check out the GitHub source; likely there is a branch within the repository that will work as advertised.

COMPLEXITY

Measures how many interconnected moving parts it took to produce this demo, and how complex these parts are.

Commercial or enterprise-level complexity.

Multiple moving parts, moderate complexity and properly abstracted.

Multiple moving parts with moderate complexity.

Multiple simple moving parts.

Student or hobbyist level. Minimal moving parts.

APPLICABILITY

Application in the real world.

Ubiquitious usage.

Widespread usage.

Useful functionality for general use cases.

Useful functionality for narrow use cases.

Theoretical only, or very simple functionality.

Search Tech